
<template>
	<div class="menu-oa">
		<el-card class="!border-none" shadow="never">
			<el-alert
					type="warning"
					title="配置微信公众号菜单，点击确认，保存菜单并发布至微信公众号"
					:closable="false"
					show-icon
			/>
		</el-card>

		<el-card class="!border-none mt-4" shadow="never">
			<div class="lg:flex flex-1">
				<!-- Phone -->
				<oa-phone></oa-phone>

				<!-- Attr -->
				<div class="mt-4 lg:mt-0 max-w-[400px]">
					<oa-attr></oa-attr>
				</div>
			</div>
		</el-card>

		<footer-btns>
			<el-button type="primary" @click="handleSave" v-perms="['channel:oaMenu:save']">
				保存
			</el-button>
			<el-button type="primary" @click="handlePublish" v-perms="['channel:oaMenu:publish']">
				发布
			</el-button>
		</footer-btns>
	</div>
</template>

<script>
	import OaPhone from './menu_com/oa-phone.vue'
	import OaAttr from './menu_com/oa-attr.vue'
	import { useMenuOa } from './menu_com/useMenuOa'
	export default {
		name: 'system',
		data() {
			return {
				config:{},
				rules: {
					app_id:[
						{required: true, message: '请输入AppID'}
					],
					app_secret:[
						{required: true, message: '请输入AppSecret'}
					],
				},
				isSaveing: false
			}
		},
		mounted() {
			this.getConfig()
		},
		methods: {
			async setConfig(){
				this.$refs.form.validate(async (valid) => {
					if (valid) {
						this.isSaveing = true;
						var res = await this.$API.setting.wx_oa.setConfig.post(this.config);
						this.isSaveing = false;
						if(res.code == 1){
							this.$emit('success', this.form, this.mode)
							this.$message.success("操作成功")
						}else{
							this.$alert(res.message, "提示", {type: 'error'})
						}
					}
				})

			},
			async getConfig(){
				var res = await this.$API.setting.wx_oa.getConfig.get()
				if(res.code == 1){
					this.config = res.data
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
.menu-oa {
}
</style>
